<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta name="misapplication-tap-highlight" content="no"/>
    <meta name="HandheldFriendly" content="true"/>
    <meta name="MobileOptimized" content="320"/>
    <title>注册</title>
    <#assign base=request.contextPath  />
    <link rel="stylesheet" type="text/css" href="${base}/Yang/layui/css/layui.css"/>
    <script src="${base}/js/jquery.js"></script>
    <script src="${base}/js/zhang.js"></script>
    <link rel="stylesheet" href="${base}/css/common.css" type="text/css" charset="utf-8"/>
    <style type="text/css">
        li {
            padding: 0.8em;
            border-bottom: 1px solid #eaeaea;
        }

        li:active {
            background: #f4f4f4;
        }

        .top2 p {
            color: white;
            padding: 10px;
            float: none;
        }
        .m-tab {
            position: relative;
            padding: 0.40rem 0 0;
            width: 100%;
            background: #fff;
        }

        .m-tab a {
            position: absolute;
            display: inline-block;
            width: 49%;
            font-size: 0.14rem;
            color: #2C2C2C;
            letter-spacing: 0;
            line-height: 0.38rem;
            text-align: center;
            text-decoration: none;
        }

        .m-tab a:first-child {
            top: 0;
            left: 0;
        }

        .m-tab a.m-coupons {
            top: 0;
            right: 0;
        }

        .m-tab a.active {
            color: #9AC747;
            border-bottom: 2px solid #9AC747;
        }

        .c-tab span {
            position: absolute;
            display: inline-block;
            width: 44%;
            font-size: 0.14rem;
            color: #2C2C2C;
            letter-spacing: 0;
            line-height: 0.38rem;
            text-align: center;
            text-decoration: none;
        }
        .m-division {
            height: 1px;
            background: #EBEBEB;
        }

        .m-view1 {
            background: #fff;
            height: 200px;
        }

        .m-view2 {
            background: #fff;
            height: 100%;
        }

        @media screen and (min-width: 360px) {
            html {
                font-size: 100px !important;
            }

            img {
                width: 100%;
                height: 100%;
                border-radius: 5px;
            }

            .layui-breadcrumb a:hover {
                color: #1E9FFF !important;
            }

            .layui-breadcrumb a:visited {
                color: #1E9FFF;
            }
            .layui-btn-fluid {
                width: 88.6%;
            }
            .layui-form-item .layui-input-inline {
                display: block;
                float: none;
                left: 0px;
                width: auto;
                margin: 10px 10px 10px 10px;
            }
            .layui-upload-drag {
                position: relative;
                padding:0px;
                margin-left: 13px;
                margin-bottom: 13px;
                width: 44%;
                height: 100px;
                border-radius: 5px;
                border: 1px dashed #9AC747;
                background-color: #fff;
                text-align: center;
                cursor: pointer;
                color: #999;
            }
            .layui-form-pane .layui-input {
                border-radius: 5px;
            }
            .layui-input, .layui-textarea {
                display: initial;
                width: 93%;
                padding-left: 10px;
            }
            .layui-input, .layui-select, .layui-textarea {
                height: 40px;
                background-color: none;
                border: 1px solid #9AC747;
            }
            .layui-form-item {
                margin-bottom: 0px;
                clear: both;
                *zoom: 1;
            }
            .layui-textarea {
                min-height: 70px;
                height: auto;
                border-radius: 5px;
                line-height: 20px;
                padding: 6px 10px;
                resize: vertical;
                border: 1px solid #9AC747;
            }
    </style>
</head>


</head>
<body onselectstart="return false;" style="height:667;">
<div class="content">
    <img style="width: 150px;height: 150px; padding: 5px;" src="${base}/img/11-2.png"/>
    <h1>集充充</h1>
    <div class="m-tab">
        <a href="javascript:void(0);" id="m-my-invite" class="active">企业</a>
        <a href="javascript:void(0);" id="m-my-coupons" class="m-coupons">个人</a>
        <div class="m-division"></div>
    </div>
    <div id="m-view1" class="m-view1">
        <form class="layui-form layui-form-pane" method="get" action="">
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input class="layui-input" lay-verify="account" id="ptname" placeholder="企业名"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input class="layui-input" lay-verify="account" id="callName" placeholder="联系人姓名"/>
                </div>
            </div>
            <div class="layui-form-item" style="width: 100%">
                <div class="layui-input-inline">
                    <input style="width: 60%;float: left;margin-left: 13px" class="layui-input isPhone" lay-verify="account" placeholder="联系人手机号" id="ptPhone" onblur="phonetxta()"/>
                    <input type="button" id="btn" value="获取验证码" style="background-color: #9AC747;width: 30%;float: right;margin-right: 13px;border-radius: 5px;height: 39px" class="layui-btn " onclick="sendSMS(this, $('#ptPhone').val())"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input class="layui-input" lay-verify="account"  id="code" placeholder="验证码"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="password" name="account" id="Pass" class="layui-input" lay-verify="password" placeholder="输入密码"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="password" name="account" class="layui-input" lay-verify="twopassword"
                           placeholder="再次输入密码" id="rePass"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <div class="layui-upload-drag" style="width: 92%;padding: 0px;height: 150px;margin-left: 0px;margin-bottom: 0px;" id="uploadZZ">
                        <i style="color: #9AC747;font-size: 90px"  class="layui-icon"></i>
                        <p>点击上传执照</p>
                        <#--   <i class="layui-icon layui-icon-loading" style="font-size: 30px; color: #1E9FFF;"></i>-->
                    </div>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <textarea placeholder="法律人信息(可不填)"  id="relactionUserInfo" class="layui-textarea"></textarea>
                </div>
            </div>

            <div style="width: 100%;padding-bottom: 20px;">
                <button type="button" class="layui-btn layui-btn-fluid" onclick="subPT()"
                        style="background-color: #9AC747;border-radius: 5px;">立即提交
                </button>
            </div>
        </form>
    </div>
    <div id="m-view2" class="m-view2" style="display: none;">
        <form class="layui-form layui-form-pane" method="get" action="">
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input class="layui-input" lay-verify="account" id="peopleName" placeholder="姓名"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input style="width: 60%;float: left;margin-left: 13px;" class="layui-input isPhone" lay-verify="account" placeholder="手机号" id="peoplePhone" onblur="phonetxt()"/>
                    <input type="button" value="获取验证码" id="btn" style="background-color: #9AC747;width: 30%;float: right;margin-right: 13px;border-radius: 5px;height: 39px" class="layui-btn" onclick="sendSMS(this,$('#peoplePhone').val())"></input>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input class="layui-input" lay-verify="account"  id="code2" placeholder="验证码"/>
                </div>
            </div>

            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="password" name="account" class="layui-input" id="peoplePass"  lay-verify="password" placeholder="输入密码"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <input type="password" id="repeoplePass" name="account" class="layui-input" lay-verify="twopassword"
                           placeholder="再次输入密码"/>
                </div>
            </div>
            <div class="layui-form-item">
                <div class="layui-input-inline">
                    <div class="layui-upload-drag" id="c1" style="float: left;">
                        <i style="color: #9AC747" class="layui-icon"></i>
                        <p>上传驾驶证正面</p>
                    </div>
                    <div class="layui-upload-drag" id="c2" style="float: left;">
                        <i style="color: #9AC747" class="layui-icon"></i>
                        <p>上传驾驶证反面</p>
                    </div>
                    <div class="layui-upload-drag" id="b1" style="float: left;">
                        <i style="color: #9AC747" class="layui-icon"></i>
                        <p>上传身份证正面</p>
                    </div>
                    <div class="layui-upload-drag" id="b2" style=";float: left;">
                        <i style="color: #9AC747" class="layui-icon"></i>
                        <p>上传身份证反面</p>
                    </div>
                </div>
            </div>

            <div style="width: 100%;padding-bottom: 20px;">
                <button type="button" class="layui-btn layui-btn-fluid" lay-submit="" lay-filter="sub" onclick="subPeople()"  style="background-color: #9AC747;border-radius: 5px;">立即提交
                </button>
            </div>
        </form>
    </div>

</div>
<script type="text/javascript">
    $('#m-return').on('click', function () {
        window.history.back()
    });
    var myCoupons = $('#m-my-coupons');
    var myInvite = $('#m-my-invite');
    var view1 = $('#m-view1');
    var view2 = $('#m-view2');
    $('#m-return').on('click', function () {
        window.history.back()
    });
    myInvite.on('click', function () {
        myInvite.addClass('active');
        myCoupons.removeClass('active');
        view1.show();
        view2.hide();
    });
    myCoupons.on('click', function () {
        myInvite.removeClass('active');
        myCoupons.addClass('active');
        view1.hide();
        view2.show();
    });
</script>
<script src="${base}/Yang/layui/layui.all.js" charset="utf-8"></script>
<script>
    //上传完毕文件以后的暂时存储变量
    var resultURL="";
    var b1url="";
    var b2url="";
    var c1url="";
    var c2url="";
    layui.use('upload', function () {
        var $ = layui.jquery
            , upload = layui.upload;

        //拖拽上传 a1
        upload.render({
            elem: '#uploadZZ'
            , url: '${base}/weUser/fileUpload'
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                layer.load(); //上传loading
            }
            , data: {flag: "a1"}
            , done: function (res) {
                layer.msg(res.msg)
                layer.closeAll('loading'); //关闭loading
                $("#uploadZZ").html('<img src="${base}/weUser/getPhoto?path='+res.data.src+'">')
                resultURL=res.data.src;
            }
            , error: function (index, upload) {
                layer.closeAll('loading'); //关闭loading
            }
        });
        //拖拽上传  b1
        upload.render({
            elem: '#b1'
            , url: '${base}/weUser/fileUpload'
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                layer.load(); //上传loading
            }
            , data: {flag: "b1"}
            , done: function (res) {
                layer.msg(res.msg)
                layer.closeAll('loading'); //关闭loading
                $("#b1").html('<img src="${base}/weUser/getPhoto?path='+res.data.src+'">')
                b1url=res.data.src;
            }
            , error: function (index, upload) {
                layer.closeAll('loading'); //关闭loading
            }
        });
        //拖拽上传 b2
        upload.render({
            elem: '#b2'
            , url: '${base}/weUser/fileUpload'
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                layer.load(); //上传loading
            }
            , data: {flag: "b2"}
            , done: function (res) {
                layer.msg(res.msg)
                layer.closeAll('loading'); //关闭loading
                $("#b2").html('<img src="${base}/weUser/getPhoto?path='+res.data.src+'">')
                b2url=res.data.src;
            }
            , error: function (index, upload) {
                layer.closeAll('loading'); //关闭loading
            }
        });
        //拖拽上传  c1
        upload.render({
            elem: '#c1'
            , url: '${base}/weUser/fileUpload'
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                layer.load(); //上传loading
            }
            , data: {flag: "c1"}
            , done: function (res) {
                layer.msg(res.msg)
                layer.closeAll('loading'); //关闭loading
                $("#c1").html('<img src="${base}/weUser/getPhoto?path='+res.data.src+'">')
                c1url=res.data.src;
            }
            , error: function (index, upload) {
                layer.closeAll('loading'); //关闭loading
            }
        });
        //拖拽上传 c2
        upload.render({
            elem: '#c2'
            , url: '${base}/weUser/fileUpload'
            , before: function (obj) { //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
                layer.load(); //上传loading
            }
            , data: {flag: "c2"}
            , done: function (res) {
                layer.msg(res.msg)
                layer.closeAll('loading'); //关闭loading
                $("#c2").html('<img src="${base}/weUser/getPhoto?path='+res.data.src+'">')
                c2url=res.data.src;
            }
            , error: function (index, upload) {
                layer.closeAll('loading'); //关闭loading
            }
        });


    });
    function sendSMS(obj,phone) {
        if(!/^1[34578]\d{9}$/.test(phone)){
            layer.msg("请输入正确手机号");
            return;
        }
        $.ajax({
            type : "POST", //提交方式
            url : "${base}/weUser/SendSMS",//路径
            data :{phone:phone},
            success : function(data) {//返回数据根据结果进行相应的处理
                layer.msg(data)
                ss(btn);
            }

        });
    }
    var countdown = 60;
    function ss(obj) {
        if (countdown == 0) {
            obj.removeAttribute("disabled");
            obj.value = "获取验证码";
            countdown = 60;
            return;
        } else {
            obj.setAttribute("disabled", true);
            obj.value = "重新发送(" + countdown + ")";
            countdown--;
        }
        setTimeout(function() {
            ss(obj)
        }, 1000)
    }


    function subPT() {
        // if(resultURL==""){
        //     layer.msg("请上传图片")
        //     return;
        // }
        if($("#rePass").val()!=$("#Pass").val()){
            layer.msg("两次密码不匹配")
            return;
        }
        var requestJson={};
        requestJson.ptname=$("#ptname").val()
        requestJson.callName=$("#callName").val();
        requestJson.callPhone=$("#ptPhone").val();
        requestJson.relactionUserInfo=$("#relactionUserInfo").val();
        requestJson.passWord=$("#rePass").val();
        $.ajax({
            type : "POST", //提交方式
            url : "${base}/weUser/insertPt",//路径
            data :{param:JSON.stringify(requestJson),code:$("#code").val(),url:resultURL},
            success : function(data) {//返回数据根据结果进行相应的处理
                if(data!="false"){
                    layer.msg(data)
                }else{
                    layer.msg("注册失败")
                }

            }
        });
    }


    function subPeople() {
        // if(b1url==""||b2url==""||c1url==""||c2url==""){
        //     layer.msg("请上传完整图片")
        //     return;
        // }
        if($("#repeoplePass").val()!=$("#peoplePass").val()){
            layer.msg("两次密码不匹配")
            return;
        }
        var requestJson={};
        requestJson.phone=$("#peoplePhone").val();
        requestJson.name=$("#peopleName").val();
        requestJson.passWord=$("#peoplePass").val();
        $.ajax({
            type : "POST", //提交方式
            url : "${base}/weUser/insertPeople",//路径
            data :{param:JSON.stringify(requestJson),code:$("#code2").val(),b1url:b1url,b2url:b2url,c1url:c1url,c2url:c2url},
            success : function(data) {//返回数据根据结果进行相应的处理
                if(data!="false"){
                    layer.msg(data)
                }else{
                    layer.msg("注册失败")
                }

            }
        });
    }

    function phonetxt() {

       var phone=$("#peoplePhone").val();

        $.ajax({
            type : "POST", //提交方式
            url : "${base}/weUser/phonetxt",//路径
            data :{phone:phone},
            success : function(data) {//返回数据根据结果进行相应的处理
                 if(data==false){
                     alert("该手机号已被注册")
                 }

            }
        });
    }

    function phonetxta() {

        var phone=$("#ptPhone").val();

        $.ajax({
            type : "POST", //提交方式
            url : "${base}/weUser/phonetxta",//路径
            data :{phone:phone},
            success : function(data) {//返回数据根据结果进行相应的处理
                if(data==false){
                    alert("该手机号已被注册")
                }

            }
        });
    }


</script>
</body>
</html>